/*
* @Author: Yejing
* @Date: 2023-05-29 17:19:09
* @LastEditors: Yejing
* @LastEditTime: 2023-06-08 13:57:21
* @Description: 视频组件
*/

<template>
    <view class="video-card-container" @click="videoInfo(details)">
        <u-image width="217rpx" height="217rpx" :src="details.img"></u-image>
        <u-icon v-if="details.img" name="play-circle-fill" size="55" color="#fff"></u-icon>
    </view>
</template>

<script>
export default {
    name: "anchorCard",
    props: {
        details: {
            default: () => ({}),
            type: Object
        }
    },
    data() {
        return {};
    },
    methods: {
        videoInfo(details) {
            this.$emit('videoInfo', details)
        }
    }
    
}
</script>

<style lang="scss" scoped>
.video-card-container {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  position: relative;

  /deep/ uni-image {
    border-radius: 24rpx !important;
  }

  /deep/ uni-video {
    width: 217rpx !important;
    height: 217rpx !important;
  }


  .u-icon {
    position: absolute;
    z-index: 999;
    bottom: 20rpx;
    right: 24rpx;

  }
}
</style>